<div class="box"></div>
<div class="enter">
    <div class="enter_lef">
        <div class="d1">登录</div>
        <div class="d2">请登录您的蒂芙尼账户</div>
        <div class="d3">
            <p class="p1">手机号</p>
            <input type="text" id="username">
        </div>
        <div class="d4">
            <p class="p1">密码</p>
            <input type="password" id="password">
        </div>
        <div class="d5" id="btn">登录</div>
    </div>
    <div class="enter_rig">
        <div class="d1">创建账户</div>
        <div class="d2">为您加快结算流程，便于查看订单历史及购物袋，以及管理电子发票</div>
        <div class="d3"><a href="./login.html">注册</a> </div>
    </div>
</div>
<script src="./javascripts/utils.js"></script>
<script>
    var p_one = document.querySelector(".enter_lef .d3 .p1")
    var p_two = document.querySelector(".enter_lef .d4 .p1")
    var inp_one = document.querySelector(".enter_lef .d3 input")
    var inp_two = document.querySelector(".enter_lef .d4 input")
    inp_one.onfocus = function () {
        p_one.className = "p1 p2";
    }
    inp_one.onblur = function () {
        if (inp_one.value === "") {
            p_one.className = "p1 p3";
        } else {
            p_one.className = "p1 p2";
        }
    }
    inp_two.onfocus = function () {
        p_two.className = "p1 p2";
    }
    inp_two.onblur = function () {
        if (inp_two.value === "") {
            p_two.className = "p1 p3";
        } else {
            p_two.className = "p1 p2";
        }
    }
    
    $(function(){
        $("#btn").click(function(){
            // $.ajax({
            //     url : "http://localhost/sever/enter.php",
            //     data : {
            //         username : $("#username").val(),
            //         password : $("#password").val()
            //     }
            // })
            // .then(function(res){
            //     console.log(res)
            // })
            let url = "http://localhost/sever/enter.php";
                  xhr("POST" , url , {
                        username : $("#username").val(),
                        password : $("#password").val()
                  }).then( function( res ){
                        var data = JSON.parse( res );
                        if( data.type === "success" ){
                            alert("登录成功")
                            setTimeout( function(){
                                location.href = "./index.html";
                            } , 1000)
                        }else{
                            alert("账号或密码不正确")
                        }
                  })
        })
    })
</script>